Creating Skins - Reference

Welcome to the new Wintropy 2 interface! Wintropy 2.0 now supports full skinning. This is a quick reference on creating skins for Dacris Software products. We have provided several skins as examples.

Before you start

The Requirements for All Wintropy Skins

- All files of the skin, including all sounds and reserved files, are mandatory! They must exist!
- Skin.def file must contain complete skin definition (all required values)
- Colors.ini is not required but may be included for backwards compatibility
- All graphics files MUST be of 256 colors or less! (24-bit color graphics will cause an error because of Windows' DIB limitations)

What you will need:

- A painting program that supports image stretching and color reduction (such as Photoshop or Paint Shop Pro)
- A sound recording or conversion application
- This documentation handy

Making the skin

The Definition File

Every Wintropy skin has a 'Skin.def' file. This file is located in the skin's directory, which can be found in the Interface subdirectory of the product.
Here are the available options for the Skin.def file:

Option name Description Section Required? Possible values
Name Specifies the name of the skin, as it is displayed in the skin selector. [Skin] Yes Any string, doesn't have to be directory name
Wintropy Specifies the minimum version of Wintropy required by this skin. [Skin] No 2 or higher, the version number; currently reserved for future versions (2.1, etc.)
NoStretchX Specifies the starting X value of the Top.bmp file where the bitmap is not stretched. [Titlebar] No Any number that is an X coordinate within the Top.bmp file
NoStretchW Specifies the width of the non-stretch area of Top.bmp [Titlebar] No Any number
ActiveTextR Specifies the RED value of the active title text color [Titlebar] No Any number under 256
ActiveTextG Specifies the GREEN value of the active title text color [Titlebar] No Any number under 256
ActiveTextB Specifies the BLUE value of the active title text color [Titlebar] No Any number under 256
SelTextR Specifies the RED value of the menu selected text [Menu] No Any number under 256
SelTextG Specifies the GREEN value of the menu selected text [Menu] No Any number under 256
SelTextB Specifies the BLUE value of the menu selected text [Menu] No Any number under 256
ShowWindowAnim Specifies the window open animation [Transitions] No A number identifier: 0 = no animation
1 = slide in
2 = fade in
HideWindowAnim Specifies the window close animation [Transitions] No A number identifier:
0 = no animation
1 = slide out
2 = fade out
ShowWindowAnimDuration Specifies the window open animation duration [Transitions] No A value that specifies the number of milliseconds
HideWindowAnimDuration Specifies the window close animation duration [Transitions] No A value that specifies the number of milliseconds

Skin elements (graphic)

File Description/Role Specifications (size) of 1 variation* # or variations Description of variations
Top.bmp The top border and titlebar background Height = 23 pixels 2 (vertical, top to bottom) 1st = Active window
2nd = Inactive window
Bottom.bmp The bottom border of the window Height = 4 pixels 2 (vertical, top to bottom) 1st = Active window
2nd = Inactive window
Left.bmp The left border of the window Width = 4 pixels
Min Height = 10 pixels
Top and bottom 4 pixels are not stretched
2 (horizontal, left to right) 1st = Active window
2nd = Inactive window
Right.bmp The right border of the window Width = 4 pixels
Min Height = 10 pixels
Top and bottom 4 pixels are not stretched
2 (horizontal, left to right) 1st = Active window
2nd = Inactive window
Close.bmp The close button of the window (right-hand corner) Width = 17 pixels
Height = 17 pixels
6 (horizontal, left to right) 1st = Normal, active
2nd = Pressed, active
3rd = Hover, active
4th = Normal, inactive
5th = Pressed, inactive
6th = Hover, inactive
Maximize.bmp The maximize button of the window, remains the same even if window is already maximized Width = 17 pixels
Height = 17 pixels
6 (horizontal, left to right) 1st = Normal, active
2nd = Pressed, active
3rd = Hover, active
4th = Normal, inactive
5th = Pressed, inactive
6th = Hover, inactive
Minimize.bmp The minimize button of the window Width = 17 pixels
Height = 17 pixels
6 (horizontal, left to right) 1st = Normal, active
2nd = Pressed, active
3rd = Hover, active
4th = Normal, inactive
5th = Pressed, inactive
6th = Hover, inactive
Icon.bmp The icon (system menu) on the left-hand corner Width = 16 pixels
Height = 16 pixels
6 (horizontal, left to right) 1st = Normal, active
2nd = Pressed, active
3rd = Hover, active
4th = Normal, inactive
5th = Pressed, inactive
6th = Hover, inactive
Help.bmp The context-help button found on some windows Width = 17 pixels
Height = 17 pixels
6 (horizontal, left to right) 1st = Normal, active
2nd = Pressed, active
3rd = Hover, active
4th = Normal, inactive
5th = Pressed, inactive
6th = Hover, inactive
Buttons.bmp All the buttons found on windows and dialog boxes Width = 20 pixels
Height = 19 pixels
1st 3 pixels on every side are borders, not stretched
5 (horizontal, left to right) 1st = Normal
2nd = Pressed
3rd = Disabled
4th = Hover
5th = Focused
Radio.bmp Radio button bitmap Width = 15 pixels
Height = 14-16 pixels
6 (horizontal, left to right) 1st = Normal
2nd = Checked
3rd = Disabled
4th = Disabled, Checked
5th = Unchecked, Hover
6th = Checked, Hover
CheckBox.bmp Checkbox bitmap Width = 15 pixels
Height = 14-16 pixels
6 (horizontal, left to right) 1st = Normal
2nd = Checked
3rd = Disabled
4th = Disabled, Checked
5th = Unchecked, Hover
6th = Checked, Hover
DlgBgnd.bmp Dialog box background Can be any size, will be TILED 1 ---
MenuBar.bmp Menu bar background Width = ANY (tiled)
Height = Multiple of 23
1 ---
MenuBgnd.bmp Menu popup background Can be any size, will be TILED 1 ---
MenuSel.bmp Menu selection background Width = 20
Height = 19
1st 3 pixels on every side are borders, not stretched
1 ---
TBarBgnd.bmp Toolbar background Can be any size, will be TILED 1 ---
TBarSel.bmp Toolbar button bitmap Width = 20
Height = 19
1st 3 pixels on every side are borders, not stretched
2 (horizontal, left to right) 1st = Mouse over
2nd = Pressed
WinBgnd.bmp The main window background for Dacris Benchmarks only Can be any size, will be TILED 1 ---

* One variation refers to one copy of the bitmap of one element (in one state), each bitmap must contain EXACTLY this number of variations for each state

Sound elements

File name Description Typical length
BtnOver.wav This sound occurs when the mouse moves over a push button 0.1 to 0.5 seconds (short)
Close.wav This sound occurs whenever a window is closed 0.5 to 2 seconds (long)
Open.wav This sound occurs whenever a window is open 0.5 to 1 second (medium)
Over.wav This sound occurs when the mouse moves over a toolbar button 0.1 to 0.5 seconds
Popup.wav This sound occurs when a menu pops up or opens 0.1 to 0.5 seconds
Select.wav This sound occurs when anything is selected (clicked) 0.1 to 0.5 seconds

Wizard elements

The following elements apply to the Wintropy wizards. Also, some files may be used as elsewhere, please read below. These files are found in the Wizard subfolder of the skin.

File name Description and uses Size
Bgnd.bmp The default background for wizard pages 364x240
Bottom.bmp The bottom background for the Next, Back, and Cancel wizard buttons Width: 606
Height: ANYTHING (will be tiled)
Leftbar.bmp The background for the bar that contains the names of the pages 190x28
Logo.bmp The skin's logo which is also used in the skin selector dialog 143x56
Merlin.bmp Reserved for now; leave blank, but you must create it ---
Top.bmp The top right-hand corner bitmap 552x38
Topbar.bmp The top of the contents bar 190x28

Testing & Troubleshooting

If you receive the following message: "Error! Can't find necessary skin files!"

Make sure you have created all the files listed in the tables above, with the correct names. Here is a checklist to doublecheck.

\: Bottom.bmp, BtnOver.wav, Bullet.bmp, 
Buttons.bmp, CheckBox.bmp, Close.bmp, 
Close.wav, DlgBgnd.bmp, Help.bmp, 
Icon.bmp, Left.bmp, Maximize.bmp, 
MenuBar.bmp, MenuBgnd.bmp, MenuSel.bmp, 
Minimize.bmp, Open.wav, Over.wav, 
Popup.wav, Radio.bmp, Right.bmp, 
Select.wav, Skin.def, TBarBgnd.bmp, 
TBarSel.bmp, Top.bmp, WinBgnd.bmp

 \Wizard: bgnd.bmp, bottom.bmp, leftbar.bmp, 
logo.bmp, merlin.bmp, top.bmp, topbar.bmp

Before you make your skin public, make sure you test it for any visual artifacts. If something doesn't look right, go back to the bitmap file and read over the specifications while analyzing it for possible errors.

Submitting Skins

To submit a skin to Dacris Software, just send it attached as a ZIP file (with directory structure) to contact@dacris.com. We will post it on our site within 24 hours.